<template>
  <h1>文本相关指令</h1>
  <!-- 插值指令 -->
  <p>{{ info }}</p>
  <h3>{{ info }}</h3>
  <h1>{{ info }}</h1>
  {{ info + "早上好" }}
  <button @click="f()">我是按钮</button>
  <hr />
  <p v-text="info"></p>
  <!-- 读取的文字是可以识别html标签的 -->
  <p v-html="info"></p>
</template>

<script setup>
import { ref } from "vue";
// 响应式变量
const info = ref("测试文本666");

const f = () => {
  //箭头函数 固定写法 (参数列表) =>{方法体}
  info.value = "值变了!!";
  info.value = "值<b>更新</b>了!!";
};
</script>

<style scoped>
</style>